<!DOCTYPE html>
<html>
<head>
    <title>Bootstrap 实例</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,   initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<h1>hello world</h1>

<!-- 按钮触发模态框 -->

<!-- 按钮触发模态框 -->

<div class="row" align="center">
    <button type="button" class="btn btn-primary" onclick="editInfo()">注册</button>
    <button type="button" class="btn btn-primary" onclick="editInfo()">登录</button>
</div>


<!-- 模态框（Modal） -->
<div class="modal fade" id="update" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title" id="myModalLabel">修改信息</h4>
            </div>
            <div class="modal-body">
                <div class="col-sm-10">用户名：<input type="text" name="username" id="username"/></div>
                <div class="col-sm-10">密码：<input type="text" name="pass" id="pass"/></div>
                <div class="col-sm-10">性别：<input type="radio" name="sex" class="sex" id="man" value="男"/>男
                    <input type="radio" name="sex" class="sex" id="women" value="女"/>女
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="update()">提交</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal -->
</div>
<!-- 模态框（Modal）end -->


<script>


    function editInfo() {
        $('#update').modal('show');
    }

    //提交更改
    function update() {
        //获取模态框数据
        var username = $('#username').val();
        var pass = $('#pass').val();
        var sex = $('input:radio[name="sex"]:checked').val();
		debugger
		var token = localStorage.getItem("token");

        alert(token)
        $.ajax({
            type: "post",
            url: "http://localhost:7379/test/zhuce",
            data: "username=" + username + "&pass=" + pass + "&name=" + name + "&sex=" + sex,
            dataType: 'json',
            contentType: "application/x-www-form-urlencoded; charset=utf-8",
			headers: {
				"Authorization":token,
				'Content-Type': 'application/x-www-form-urlencoded'
			},
            success: function (result) {
                if (result.token) {
                    alert("cheng")
                } else {
                    alert("登录失败");
                }
                //location.reload();
            }
		});
	}

</script>
</body>

</html>
